<template>
  <Modal
      v-model="drawer.show" transfer
      :title="lang.title"
      :width="80"
      :closable="true"
      :mask-closable="false"
      :styles="{top: '20px', maxWidth: '1200px', maxHeight: 'calc(100vh - 30px)', overflow: 'auto'}"
      @on-ok="$emit('submit',data)">
    <cfg-hier-twins-dictionary v-if="drawer.show&&modelType==='twinsDictionary'" :data="data"></cfg-hier-twins-dictionary>
    <cfg-hier-twins-queue v-if="drawer.show&&modelType==='twinsQueue'" :data="data"></cfg-hier-twins-queue>
    <cfg-hier-twins-singleton v-if="drawer.show&&modelType==='twinsSingleton'" :data="data"></cfg-hier-twins-singleton>
    <cfg-hier-twins-tree v-if="drawer.show&&modelType==='twinsTree'" :data="data"></cfg-hier-twins-tree>
    <cfg-hier-logic-dictionary v-if="drawer.show&&modelType==='logicDictionary'" :data="data"></cfg-hier-logic-dictionary>
    <cfg-hier-logic-queue v-if="drawer.show&&modelType==='logicQueue'" :data="data"></cfg-hier-logic-queue>
    <cfg-hier-logic-singleton v-if="drawer.show&&modelType==='logicSingleton'" :data="data"></cfg-hier-logic-singleton>
    <cfg-hier-logic-tree v-if="drawer.show&&modelType==='logicTree'" :data="data"></cfg-hier-logic-tree>
    <cfg-hier-template-dictionary v-if="drawer.show&&['templateDictionary', 'statisticsTemplate'].includes(modelType)" :data="data"></cfg-hier-template-dictionary>
    <cfg-hier-template-dictionary v-if="drawer.show&&modelType==='statistics'" :data="data"></cfg-hier-template-dictionary>
    <cfg-hier-template-queue v-if="drawer.show&&modelType==='templateQueue'" :data="data"></cfg-hier-template-queue>
    <cfg-hier-template-singleton v-if="drawer.show&&modelType==='templateSingleton'" :data="data"></cfg-hier-template-singleton>
    <cfg-hier-template-tree v-if="drawer.show&&modelType==='templateTree'" :data="data"></cfg-hier-template-tree>
  </Modal>
</template>

<script>
import CfgField from "../../wizard/fields/cfg-field";
import CfgCell from "../../wizard/fields/cfg-cell";
import CfgHierTwinsDictionary from "./parts/cfg-hier-twins-dictionary";
import CfgHierTwinsQueue from "./parts/cfg-hier-twins-queue";
import CfgHierTwinsSingleton from "./parts/cfg-hier-twins-singleton";
import CfgHierTwinsTree from "./parts/cfg-hier-twins-tree";
import CfgHierLogicDictionary from "./parts/cfg-hier-logic-dictionary";
import CfgHierLogicQueue from "./parts/cfg-hier-logic-queue";
import CfgHierLogicSingleton from "./parts/cfg-hier-logic-singleton";
import CfgHierLogicTree from "./parts/cfg-hier-logic-tree";
import CfgHierTemplateDictionary from "./parts/cfg-hier-template-dictionary";
import CfgHierTemplateQueue from "./parts/cfg-hier-template-queue";
import CfgHierTemplateSingleton from "./parts/cfg-hier-template-singleton";
import CfgHierTemplateTree from "./parts/cfg-hier-template-tree";
export default {
  name: "hierachyEditor",
  components: {
    CfgHierTemplateTree,
    CfgHierTemplateSingleton,
    CfgHierTemplateQueue,
    CfgHierTemplateDictionary,
    CfgHierLogicTree,
    CfgHierLogicSingleton,
    CfgHierLogicQueue,
    CfgHierLogicDictionary,
    CfgHierTwinsTree, CfgHierTwinsSingleton, CfgHierTwinsQueue, CfgHierTwinsDictionary, CfgField,CfgCell},
  data(){
    return {
      model:null,
      currentMenu:'',
      elementIndex:-1,
    }
  },
  props: {
    drawer: {
      default: () => {
        return {
          show: false
        };
      }
    },
    width: {
      default: () => {
        return 800;
      }
    },
    menuRate: {
      default: () => {
        return 6;
      }
    },
    data: {
      default: () => {
        return {};
      }
    },
    modelType:{
      default: () => {
        return 'twinsDictionary';
      }
    }
  },
  computed: {
    lang() {
      return {
        "en-US": {
          title: 'register edit',
          basic: 'basic config',
          element: 'dictionary item',
          newElement: 'new item',
          model:'model'
        },
        "zh-CN": {
          title: '注册编辑',
          basic: '基础配置',
          element: '字典条目',
          newElement: '新增条目',

        },
      }[this.G_Locale];
    },
  },
  watch:{

  },
  methods:{

  }
}
</script>

<style scoped lang="scss">
.body-content {
  padding: 2px;
}
.color-change {
  width:auto;
  ::v-deep .ivu-select-dropdown {
    width:auto;
  }
}
</style>